# 第一章：初识 Dora：游戏开发入门

&emsp;&emsp;在本章中，我们将一起踏上 Dora 游戏引擎的学习之旅。你将了解 Dora 的基本概念，学习如何搭建开发环境，并创建第一个简单的游戏项目，为后续的学习打下基础。

:::info 提示
&emsp;&emsp;在本教程中，我们将使用 TSX 语言编写游戏代码。如果你对 TSX 不熟悉，建议先学习一下 Dora 的这篇 [TSX 新手教程](/docs/tutorial/Language%20Tutorial/using-tsx)。如果是希望对编程语言有更加充分和深入的学习准备，可以参考官方的 [TypeScript](https://www.typescriptlang.org/) 和 [JSX](https://reactjs.org/docs/introducing-jsx.html) 的基本知识。但是上手这个系列教程实际只用了解 TSX 的基本语法，或是干脆就全凭自己对编程开发的常识和经验大胆试试看吧。
:::

---

## 1. Dora 是什么？

&emsp;&emsp;Dora 是一个跨平台的开源游戏引擎，旨在帮助开发者在多种设备上快速构建游戏。它内置易用的开发工具链，支持在手机、开源掌机等设备上进行游戏开发和编程学习。通过 Dora 引擎，开发者可以使用 Lua、Teal、TypeScript、YueScript 等多种编程语言编写游戏逻辑，极大地降低了开发门槛。

---

## 2. 搭建开发环境

&emsp;&emsp;根据不同的操作系统，Dora 提供了灵活的安装方式。请根据您的设备系统按照以下步骤进行安装。

1. 在游戏的运行终端上下载并安装 Dora SSR 软件。详细安装步骤请参考[这里](/docs/tutorial/quick-start#2-安装)的安装步骤。
2. 运行应用程序，启动后会显示一个局域网内的服务器地址。
3. 在同一网络的 PC、平板或其他开发设备上，通过浏览器访问该服务器地址。
4. 现在，你可以在浏览器中开始游戏开发了。

## 3. 编写第一个游戏程序

&emsp;&emsp;安装完成后，你可以通过 Dora 的 Web IDE 编写和运行游戏。以下是创建第一个简单项目的步骤。

### 第一步：创建新项目

1. 打开浏览器，访问前面启动软件时显示的服务器地址，进入 Dora 的 Web IDE。
2. 在 Web IDE 左侧的资源树中，右键点击“工作空间”菜单。
3. 点击“新建”，选择“新建文件夹”，将文件夹命名为 `Hello`，作为项目的根文件夹。

### 第二步：编写游戏代码

1. 在 `Hello` 文件夹中创建一个游戏入口代码文件。右键点击 `Hello` 文件夹，选择“新建文件”，并将文件命名为 `init`。
2. 选择 TypeScript 语言，并使用文件后缀名 `.tsx`，编写以下简单的示例代码：

	```tsx title="Hello/init.tsx"
	// @preview-file on clear
	import { React, toNode } from 'DoraX';

	// 创建一个显示文本的节点
	const HelloDora = () => (
		<label fontName='sarasa-mono-sc-regular' fontSize={60} text='Hello, Dora!'/>
	);

	// 将节点添加到游戏界面
	toNode(<HelloDora/>);
	```

3. 代码编写完成后按下 `Ctrl + S` 保存文件。这时 Dora 引擎的窗口应该会自动刷新，你应该可以看到窗口上显示“Hello, Dora!”的文字，表示你已经成功运行了第一个简单的游戏程序。

### 第三步：再次运行游戏

1. 点击编辑器右下角的 🎮 图标，打开运行菜单。
2. 在菜单中点击“运行”选项，或者按下组合键 `Ctrl + R`。
3. 程序会自动重新编译并运行，你可以看到游戏窗口中显示“Hello, Dora!”的文字。

---

## 4. 探索 Dora 的开发者工具

&emsp;&emsp;Dora 的 Web IDE 为开发者提供了代码编辑、资源管理、实时预览等功能：

- **资源树**：在左侧显示项目的文件和文件夹，便于组织项目结构。
- **代码编辑器**：支持 Lua、Teal、TypeScript 和 YueScript 等多种语言的语法高亮和错误提示。
- **实时预览**：修改代码后，可以实时查看效果，非常适合快速调试和调整。

&emsp;&emsp;通过这些功能，你可以轻松完成游戏的编写、调试和运行操作。

---

## 5. 总结和展望

&emsp;&emsp;在本章中，你学会了如何在不同平台上安装 Dora 并搭建开发环境，创建了第一个简单的游戏项目，并熟悉了 Dora Web IDE 的基本使用。你已经为接下来的学习打下了基础。

&emsp;&emsp;说到进行游戏开发，我们肯定是缺少不了要对游戏做设计。在这个系列的教程中，我们将会带你一步一步的完成一个名叫 Dodge the Creeps 的游戏。这个游戏的设计思路如下：

* Dodge the Creeps 是一款简单却富有挑战性的生存游戏，玩家需要不断躲避从四面八方袭来的敌人，尽可能保持存活的时间。设计思路包含以下核心元素：

* **游戏目标**：玩家控制一个角色在屏幕中移动，躲避来自随机方向的敌人。游戏的目标是尽可能长时间地存活，过程中得分会逐步增加，展示玩家的生存技能。

* **敌人生成和移动**：敌人会从屏幕边缘的随机位置生成，并以一定的速度朝向玩家移动。随着游戏进行，敌人的速度或数量会增加，提升游戏难度。

* **玩家角色控制**：玩家可以通过键盘或手柄控制角色的上下左右移动。角色的移动需要足够灵活，帮助玩家躲避敌人的攻击。

* **碰撞检测与游戏结束**：当玩家与敌人碰撞时，游戏结束。此时会显示游戏得分和“Game Over”字样，提供给玩家简单的反馈。

* **开始界面和得分显示**：游戏开始时，有一个简单的启动界面，玩家点击开始按钮即可进入游戏。游戏过程中，得分会实时显示在屏幕上。

&emsp;&emsp;Dodge the Creeps 的核心设计简单明了，但它考验了玩家的反应速度和策略思维，是一款很好的新手练习项目。从下一篇教程开始，我们将一步步实现这些设计，构建完整的游戏，希望你能够跟随我们一起完成这个项目吧。
